﻿var currentImage;
var currentIndex = -1;
var interval;

var myTimer;

function showImage(index) {
    if (index < $('#bigPic img').length) {
        var indexImage = $('#bigPic img')[index]
        if (currentImage) {
            if (currentImage != indexImage) {
                $(currentImage).css('z-index', 2);
                clearTimeout(myTimer);
                $(currentImage).fadeOut(250, function () {
                    myTimer = setTimeout("showNext()", 3000);
                    $(this).css({ 'display': 'none', 'z-index': 1 })
                });
            }
        }
        $(indexImage).css({ 'display': 'block', 'opacity': 1 });
        currentImage = indexImage;
        currentIndex = index;
        $('#thumbs li').removeClass('active');
        $($('#thumbs li')[index]).addClass('active');
    }
}

function showNext() {
    var len = $('#bigPic img').length;
    var next = currentIndex < (len - 1) ? currentIndex + 1 : 0;
    showImage(next);
}


$(document).ready(function () {
    $('#mycarousel').jcarousel({
        wrap: 'circular',
        scroll: 1,
        auto: 2
    });


    $('#mycarousel').jcarousel({
        wrap: 'circular',
        scroll: 1,
        auto: 2
    });
    $('#tabs1 a.tab').click(function () {
        $('.active-tab').removeClass('active-tab');
        $(this).addClass('active-tab');
        $('.content-tabs').hide();
        var content_show = $(this).attr('title');
        $('#' + content_show).show();
    });
    $('#tabs2 a.tab').click(function () {
        $('.active-tab2').removeClass('active-tab2');
        $(this).addClass('active-tab2');
        $('.content-tabs2').hide();
        var content_show = $(this).attr('title');
        $('#' + content_show).show();
    });




    myTimer = setTimeout("showNext()", 3000);
    showNext(); //loads first image
    $('#thumbs li').bind('click', function (e) {
        var count = $(this).attr('rel');
        showImage(parseInt(count) - 1);
    });



    $('#next').click(function () {

        var len = $('#bigPic img').length;
        var next = currentIndex < (len - 1) ? currentIndex + 1 : 0;
        showImage(next);

    });
    $('#prev').click(function () {
        var len = $('#bigPic img').length;
        var next = currentIndex < (len) ? currentIndex - 1 : 0;
        if (next >= 0) {
            showImage(next);
        }
        else {

            showImage(len - 1);
            next = len - 1;
        }
    });
});